<template>
	<view class="indexrecomend">
		<p class="title text-h1">
			热门推荐>
		</p>
		<van-swipe  :loop="false" :width="235" :show-indicators="false">
			<van-swipe-item v-for="item in hotRecommends" :key="item.id" >
				<view class="item">
					<img class="item-hot-image" :src="item.coverImgUrl" alt="" />
					<div class="van-multi-ellipsis--l2 text1">
					  {{item.name}}
					</div>
				</view>
			</van-swipe-item>
		</van-swipe>
	</view>
</template>

<script setup>
import { onMounted, ref } from 'vue'

import { hotrecommentApi } from '../../api/homeApi.js'

// 热门推荐数据
let hotRecommends = ref([])

let getHot = () => {
	hotrecommentApi(6).then(res => {
		// playlists.coverImgUrl
		hotRecommends.value = res.data.playlists
		// console.log(res)
	})
}

onMounted(() => {
	getHot()
})
</script>

<style lang="scss" scoped>
	@import url('uni-indexRecommend.scss');
</style>
